<template>
<label class="va-df-control-label"
       v-if="!labelHidden"
       :style="field.labelStyle"
       :class="field.labelClass">
  <span v-if="labelHtml" v-html="labelHtml"></span>
  <template v-else>
    {{label}}
  </template>
</label>
</template>

<script>
import _ from 'lodash'
import Emitter from '../utils/emitter-mixin'

/*
* Form项组件的Label
* */
export default {
  name: 'DynamicFormLabelField',
  mixins: [Emitter],
  computed: {
    /*
    * 最近的具有model的组件（FormGroup或者DynamicForm）
    * */
    nmcComponent () {
      return this.findNMCParent()
    },
    /*
    * 上一层的Model，如果没有则等于formModel
    * */
    model () {
      return (this.nmcComponent && this.nmcComponent.model) || {}
    },
    formModel () {
      return (this.nmcComponent && this.nmcComponent.formModel) || {}
    },
    /*
    * labelStyle,
    * labelClass,
    * label, // 标签，字符串，如果为空，则显示对应属性的名称，可为 function(model, formModel, field):string
    * labelHidden // 是否隐藏，可为 function(model, formModel, field):boolean，默认 false
    * */
    field () {
      return (this.nmcComponent && this.nmcComponent.field) || {}
    },
    label () {
      if (_.isNil(this.field.label)) {
        return this.field.name
      }
      if (_.isFunction(this.field.label)) {
        return this.field.label(this.model, this.formModel, this.field)
      }
      return this.field.label
    },
    labelHtml () {
      if (_.isNil(this.field.labelHtml)) {
        return null
      }
      if (_.isFunction(this.field.labelHtml)) {
        return this.field.labelHtml(this.model, this.formModel, this.field)
      }
      return this.field.labelHtml
    },
    labelHidden () {
      if (_.isNil(this.field.labelHidden)) {
        return false
      }
      if (_.isFunction(this.field.labelHidden)) {
        return this.field.labelHidden(this.model, this.formModel, this.field)
      }
      return !!this.field.labelHidden
    }
  }
}
</script>
